Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Focus input after submitting riddle #793

Merged
merged 1 commit into from
Oct 23, 2024

Conversation

EasySouls
Copy link
Contributor

After the user submits the riddle, and it was not correct, the ref to the solutionInput gets focused.

After using the riddles a few times, I noticed that I always had to click back to the input field, after submitting the riddle, even when I didn't press the Submit button, but pressed Enter. This should fix that.

@EasySouls EasySouls added enhancement New feature or request FRONTEND labels Sep 23, 2024
Copy link

vercel bot commented Sep 23, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
cmsch-g7 ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
cmsch-golyabal ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
cmsch-gtb ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
cmsch-qpa ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
cmsch-tanfolyam ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
cmsch-testing ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 23, 2024 1:55pm
9 Skipped Deployments
Name Status Preview Comments Updated (UTC)
cmsch-cst ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-felezo ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-golyakonf ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-golyakorte ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-karacsony ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-kozelokepzes ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-schnyari ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-seniortabor ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm
cmsch-snyt ⬜️ Ignored (Inspect) Oct 23, 2024 1:55pm

@EasySouls
Copy link
Contributor Author

Oh and btw, if I understood it correctly, when developing cmsch I should commit my branch into staging and not master, right?

@Tschonti
Copy link
Member

I think this was intentional so they wouldn't be able to spam with holding down Enter, but there are probably better ways to deal with that (debouncing or rate limiting)

@EasySouls
Copy link
Contributor Author

Meanwhile I tried out the qpaweb on mobile. I think it would be a great ux impovement on pc or laptop, but not so much on mobile, since it also brings up the keyboard, and people might want to look at the picture before guessing again. Is there a way to check what kind of device the client is using in React?

@Tschonti
Copy link
Member

oh I see there's a 1 sec timer after submitting, so they shouldn't be able to spam.

btw I think you can solve this just by removing the .blur() (opposite of .focus()) in line 66

@Tschonti
Copy link
Member

Meanwhile I tried out the qpaweb on mobile. I think it would be a great ux impovement on pc or laptop, but not so much on mobile, since it also brings up the keyboard, and people might want to look at the picture before guessing again. Is there a way to check what kind of device the client is using in React?

you always have access to the window.innerWidth property, if it's under ~500px, it's most likely a mobile (or PC with devtools open :D)

@EasySouls
Copy link
Contributor Author

Ahh, wonderful solution :D
Just to defend my case, I think it is better to defocus the input at first, and the only refocus when the action is successful but the solution is wrong, Since, I think, we wouldn't want to refocus on network error or when the user is banned.

@EasySouls EasySouls marked this pull request as draft September 23, 2024 22:01
@Isti01
Copy link
Collaborator

Isti01 commented Sep 24, 2024

Don't forget to rebase your branch onto staging

@Isti01
Copy link
Collaborator

Isti01 commented Oct 23, 2024

any update on this?

@EasySouls
Copy link
Contributor Author

Oh none, I think this will work just fine, I just waited for approval and forgot to close the pr. Btw should I close it myself, or always wait for reviewers with closing pull requests on bigger projects?

@Isti01
Copy link
Collaborator

Isti01 commented Oct 23, 2024

This one is not merged yet, could you mark it as ready, please?

@Isti01
Copy link
Collaborator

Isti01 commented Oct 23, 2024

Don't forget to rebase onto staging too :)

@EasySouls EasySouls marked this pull request as ready for review October 23, 2024 12:48
@EasySouls
Copy link
Contributor Author

How can I solve the merge conflicts? Usually there is a merge conflict solver, but I don't see a link to it now.

@Isti01 Isti01 force-pushed the enchancement/riddle-focus-input branch from c5adc3d to 839f91e Compare October 23, 2024 13:55
@Isti01
Copy link
Collaborator

Isti01 commented Oct 23, 2024

I rebased it for you

Copy link

Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request FRONTEND
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

3 participants